@prefix-sideMenuItemSub: ~'@{nameSpace}-sideMenuItemSub';

.@{prefix-sideMenuItemSub} {
  .flex();
  .align-center();
  .cursor-pointer();
  width: 100%;
  height: 56px;
  padding-right: 24px;
  color: var(--design-text-color-5);
  gap: 15px;
  transition: all var(--animation-time-base);

  .@{prefix-sideMenuItemSub}-title {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .@{prefix-sideMenuItemSub}-rightIcon {
    transition: all 0.3s;
  }

  .@{prefix-sideMenuItemSub}-rightIcon-rotate90 {
    transform: rotate(90deg);
  }


  &:hover {
    background-color: var(--design-base-color-4);
  }
}

.@{prefix-sideMenuItemSub}-shadow {
  box-shadow: 0px 10px 10px -5px var(--design-shadow-color-sm);
}